<template xmlns="">
  <div style="display: flex;display: -webkit-flex;flex-direction: column;width:100%;height:100%">

	<div class="yi">
		<van-icon name="arrow-left" fixed="true" @click="onClickLeft"></van-icon>
		<div>
			<van-icon name="shop-o"></van-icon>
			<span class="yiyi">帮我买</span>

			<van-icon name="arrow-down"></van-icon>
		</div>
		<van-icon name="chat"></van-icon>
	</div>

	<div class="er" style="flex: 1;">
		<div class="te"></div>

		<input type="text" class="eryi" placeholder="帮我购买:" style="font-size: 12px;">
		<div class="erer">
			<div style="display: flex;justify-content: space-around">
				<div class="er21">选择店铺</div>
				<div class="er22">
					<van-icon name="star-o"></van-icon>就近购买</div>
			</div>
			<router-link to="/gmdzfb">
				<p style="float:left;font-size: 13px;margin-left: 20px;">请选择购买地址</p>
			</router-link>
		</div>

		<div class="erer">
			<div style="display: flex;justify-content: space-around">
				<div class="er21">家的地址</div>
				<div class="er22">
					常用地址</div>
			</div>
			<router-link to="/shdzfb">
				<p style="float:left;font-size: 13px;margin-left: 20px;">请选择收货地址</p>
			</router-link>
		</div>

		<div class="ersi">
			<router-link to="/gmsjfb">
				<input type="text" placeholder="购买时间：" id="gmsjs" >
				<span style="border:0;line-height: 60px;height:58px;color:#ccc">立即购买
        </span>
			</router-link>
			<van-icon name="arrow"></van-icon>
		</div>

		<div class="erwu">
			<input type="text" placeholder="优惠券选择：" id="yhs" >
			<span style="border:0;line-height: 60px;height:58px;color:#ccc">新用户立减20元
        </span>
			<van-icon name="arrow"></van-icon>
		</div>

		<div class="erliu">
			<input type="text" placeholder="排队目的商品价格：" id="pds" >
			<span style="    width: 40%;  display: inline-block; overflow: hidden; border:0;line-height: 60px;height:58px;color:#ccc ">亲输入商品价格货凭小票支付
        </span>
			<van-icon name="gold-coin-o"></van-icon>
		</div>
	</div>
	
	
	<div class="san">
		
		<div style="height:25%;border-bottom: 1px solid #ccc;text-align: center;">
			<span style="    margin-top: 7%;display: inline-block;">
				请选择购买时间
			</span>
			<van-icon name="close" />
		</div>
		
		<div style="height:25%;border-bottom: 1px solid #ccc;">
			<div style="float:left;    margin-top: 7%;margin-left: 7%;">今天</div>
			<div style="margin: 7% auto;width:25%;float:right;margin-right: 30%;">立即购买</div>
		</div>
		
		<div style="height:25%;border-bottom: 1px solid #ccc;">
			<div style="float:left;    margin-top: 7%;margin-left: 7%;">明天</div>
		</div>
		
		<div style="height:2%;"></div>
		
	</div>
</div>
</template>

<script>
  export default {
    name: "Gmsjfb",
    data() {
      return {

      }
    },
    methods: {
      onClickLeft() {
       this.$router.go(-1)
      },
    }
  }
</script>

<style scoped>
  .yi{
    width:100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .van-icon-chat{
    margin-right: 15px;
  }
  .van-icon-arrow-left{
    margin-left: 15px;
  }
  .er{
    background: #f2eef4;
    overflow: auto;
  }
  .eryi{
    width:90%;
    height:60px;
    background:#fff;
    border-radius: 4px;
    margin: 4% 0 4% 0;
    border:0;
  }
  .erer{
    width:90%;
    height:100px;
    background:#fff;
    border-radius: 4px;
    margin: 4% 0 4% 5%;
    border:0;
  }
  .er21{
    width:100px;
    height:22px;
    border-radius: 4px;
    font-size:12px;
    border:1px solid #ccc;
    float:left;
    text-align: center;
    line-height: 20px;
    margin-top: 10px;

  }
  .er22{
    width:100px;
    height:22px;
    border-radius: 4px;
    font-size:12px;
    border:1px solid #ccc;
    float:left;
    text-align: center;
    line-height: 20px;
    margin-top: 10px;

  }
  .ersi{
    width:90%;
    height:60px;
    background:#fff;
    border-radius: 4px;
    margin-left: 5%;
    border:0;
    font-size: 12px;

  }
  .er .van-icon-arrow{
    float:right;
    line-height: 60px;
    margin-right: 5%;
  }
  .van-icon-gold-coin-o{
    float:right;
    line-height: 60px;
    margin-right: 5%;
  }
  .erwu{
    width:90%;
    height:60px;
    background:#fff;
    border-radius: 4px;
    margin: 4% 0 4% 5%;
    border:0;
    font-size: 12px;
  }
  .erliu{
    width:90%;
    height:60px;
    background:#fff;
    border-radius: 4px;
    margin: 0 0 4% 5%;
    border:0;
    font-size: 12px;
  }
  .van-icon-gold-coin{
    position: absolute;
  }
	.te{
	position: absolute;
    opacity: 0.5;
    width: 100%;
    height: 92%;
    background: #000;
	}
	.san{
	height: 46%;
    width: 100%;
    background: #fff;
    z-index: 1;
	}
	.van-icon-close{
		float:right;
		margin-top: 8%;
		margin-right: 6%;
	}
  #gmsjs{width: 20%; border:0; float:left;line-height: 60px;height:58px;margin-left: 7%}
  #yhs{width: 24%; border:0; float:left;line-height: 60px;height:58px;margin-left: 7%}
  #pds{width: 38%; border:0; float:left;line-height: 60px;height:58px;margin-left: 7%}
</style>
